<template>
  <el-breadcrumb :separator-icon="ArrowRight" style="margin-bottom: 16px">
    <el-breadcrumb-item v-if="props.dataSrouce?.length === 0">首页</el-breadcrumb-item>
    <template v-else>
      <el-breadcrumb-item
        v-for="(item, index) in props.dataSrouce"
        :key="item.key"
        :to="index !== dataSrouce.length - 1 ? item.key : null"
        >{{ item.title }}</el-breadcrumb-item
      >
    </template>
  </el-breadcrumb>
</template>

<script setup lang="ts">
import { ElBreadcrumb, ElBreadcrumbItem } from 'element-plus'
import { ArrowRight } from '@element-plus/icons-vue'

const props = defineProps<{
  dataSrouce: any[]
}>()
</script>
